$(function (){
    let weekday;
    weekday = ["星期一", "星期二", "星期三", "星期四", "星期五"];
    let timeFrame;
    timeFrame = ["08:05~09:50", "10:15~12:00", "13:35~15:20", "15:45~17:30", "18:30~20:45"];
    //时间转换方法
    function transform(time) {
        let timeValue_decade = parseInt(time.substring(0, 1));
        let timeValue_units = parseInt(time.substring(1));
        return weekday[timeValue_decade - 1] + timeFrame[timeValue_units - 1];
    }
    //对导航添加事件，切换导航时隐藏之前的页面内容
    $('.nav li').click(function() {
        $(".event-disabled").removeClass("event-disabled")
        //避免重复点击同一个导航
        $(this).addClass('event-disabled')
        //隐藏之前的页面内容
        if($('.show').length > 0){
            $(".show").addClass("hidden").removeClass("show")
        }
    })
    //为"添加课程"导航添加功能
    $('#addCourseNav').click(function() {
        if($('#courseTableDiv').length > 0){
            $('#courseTableDiv').remove()
        }
        $.ajax({
            url:basePath+"ShowCourseServlet",
            type:"POST",
            datatype: 'JSON',
            contentType :'application/json;charset=utf-8',
            success : function(data) {
                let count = 1
                //生成装载选课表格的div
                let $courseTableDiv='<div class="table-responsive  show" id="courseTableDiv"></div>'
                //将表格添加至main.html
                $('#navbar').after($courseTableDiv)
                //动态生成选课表格
                let $courseTable='<table class="table table-bordered table-hover table-condensed" id="courseTable"><thead></thead><tbody></tbody></table>'
                $("#courseTableDiv").append($courseTable)
                //生成表头
                let $thead='<tr><th>#</th><th>课程编号</th><th>课程名称</th><th>授课教师</th><th>学分</th><th>上课时间1</th><th>上课时间2</th><th>上课地点</th><th>总容量</th><th>选课</th></tr>'
                $('#courseTable thead').append($thead)
                //生成选课按钮
                let $btn = '<div>' +
                    '<button type="button"  id="addCourseBtn" class="show btn btn-primary btn-lg col-lg-4 col-lg-offset-4 col-md-4 col-md-offset-4 col-xs-12 col-sm-12 bottom">提交选课</button>' +
                    '</div>'
                $("#courseTableDiv").after($btn)
                //遍历课程信息
                for(let p in data){
                    //自调用函数，生成table-row
                     (function(i) {
                        let $tr = '<tr class="table-row">' +
                            '<th scope="row" class="row-head"></th>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td><div >' +
                            '<label><input type="checkbox" class="" name="selectCourse" value="">' +
                            '</label>' +
                            '</div></td>' +
                            '</tr>'
                         //向table-row添加数据
                        $('#courseTable tbody').append($tr)
                        $('#courseTable').find('td').addClass("text-center")
                        $('#courseTable tr[class="table-row"]:eq('+(i-1)+')').find('th').text(i)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(0)').text(data[p].courseId)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(1)').text(data[p].courseName)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(2)').text(data[p].teacher)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(3)').text(data[p].point)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(4)').text(transform(data[p].time1))
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(5)').text(transform(data[p].time2))
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(6)').text(data[p].location)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(7)').text(data[p].limited)
                        $('#courseTable').find('.table-row:eq('+(i-1) +') td:eq(8)').prop('value',data[p].courseId)
                         count++
                    })(count)
                }
                //文字居中
                $('th').addClass("text-center")
                //点击行可以勾选复选框
                $('#courseTable tbody tr').click(function () {
                    let checkbox =  $(this).find('input')
                    checkbox.prop('checked', !checkbox.prop('checked'));
                    if ($("input[name='selectCourse']:checked").length > 2){
                        checkbox.prop('checked', !checkbox.prop('checked'));
                        commonUtil.message("最多选择2个",'warning')
                    }
                })
                $('input[name="selectCourse"]').click(function() {
                    if ($(this).prop('checked') === false) {
                        $(this).prop('checked',true)
                    }else {
                        $(this).prop('checked',false)
                    }
                })
            },
            error : function(arg1) {
                alert("连接失败,请检查网络配置")
                 console.log(arg1)
            }
        })
    })
    //为"添加课程"导航添加功能
    $('#showCourseNav').click(function() {
        if($('#selectedCourseTableDiv').length > 0){
            $('#selectedCourseTableDiv').remove()
        }
        $.ajax({
            url :basePath + "ShowSelectedCourseServlet",
            type:"POST",
            datatype: 'JSON',
            contentType :'application/json;charset=utf-8',

            success : function(data){
                commonUtil.message("您选择的课程：")
                let $selectedCourseTableDiv='<div class="table-responsive  show" id="selectedCourseTableDiv"></div>'
                $('#navbar').after($selectedCourseTableDiv)
                let $selectedCourseTable='<table class="table table-bordered table-hover table-condensed" id="selectedCourseTable"><thead></thead><tbody></tbody></table>'
                $("#selectedCourseTableDiv").append($selectedCourseTable)
                let $thead='<tr><th>#</th><th>课程编号</th><th>课程名称</th><th>授课教师</th><th>学分</th><th>上课时间1</th><th>上课时间2</th><th>上课地点</th></tr>'
                $('#selectedCourseTable thead').append($thead).find('th').addClass("text-center")
                $('#selectedCourseTable').find('td').addClass("text-center")
                let count = 1;
                for (let p in data){
                    (function(i) {
                        let $tableRow ='<tr class="table-row" >' +
                            '<th scope="row" class="row-head text-center"></th>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '<td></td>' +
                            '</tr>'
                        $('#selectedCourseTable tbody').append($tableRow)
                        $('#selectedCourseTable').find('td').addClass("text-center")
                        $('#selectedCourseTable tr[class="table-row"]:eq('+(i-1)+')').find('th').text(i)
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(0)').text(data[p].courseId)
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(1)').text(data[p].courseName)
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(2)').text(data[p].teacher)
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(3)').text(data[p].point)
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(4)').text(transform(data[p].time1))
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(5)').text(transform(data[p].time2))
                        $('#selectedCourseTable').find('.table-row:eq('+(i-1) +') td:eq(6)').text(data[p].location)
                        count++
                    })(count)
                }
            },
            error : function(arg1) {
                alert("连接失败,请检查网络配置")
                console.log(arg1)
            }
        })

    })
});